<template>
	<view>
		<qiun-title-bar titlie="博客类别比例"></qiun-title-bar>
		<view class="charts-box">
		  <qiun-data-charts type="pie" :chart-data="pie" :opts="opts":chartData="chartData"/>
		</view>
		<qiun-title-bar titlie="最新博客分析"></qiun-title-bar>
		<view class="charts-box">
		  <qiun-data-charts type="pie" :chart-data="pie" :opts="opts":chartData="chartData"/>
		</view>
		<qiun-title-bar titlie="词云"></qiun-title-bar>
		<view class="charts-box">
		  <qiun-data-charts type="pie" :chart-data="pie" :opts="opts":chartData="chartData"/>
		</view>
	</view>
  
</template>

<script>
export default {
  data() {
    return {
      chartData: {},
      //您可以通过修改 config-ucharts.js 文件中下标为 ['ring'] 的节点来配置全局默认参数，如都是默认参数，此处可以不传 opts 。实际应用过程中 opts 只需传入与全局默认参数中不一致的【某一个属性】即可实现同类型的图表显示不同的样式，达到页面简洁的需求。
      opts: {
        rotate: false,
        rotateLock: false,
        color: ["#1890FF","#91CB74","#FAC858","#EE6666","#73C0DE","#3CA272","#FC8452","#9A60B4","#ea7ccc"],
        padding: [5,5,5,5],
        dataLabel: true,
        enableScroll: false,
        legend: {
          show: true,
          position: "right",
          lineHeight: 25
        },
        title: {
          name: "收益率",
          fontSize: 15,
          color: "#666666"
        },
        subtitle: {
          name: "70%",
          fontSize: 25,
          color: "#7cb5ec"
        },
        extra: {
          ring: {
            ringWidth: 60,
            activeOpacity: 0.5,
            activeRadius: 10,
            offsetAngle: 0,
            labelWidth: 15,
            border: false,
            borderWidth: 3,
            borderColor: "#FFFFFF"
          }
        }
      }
    };
  },
  onReady() {
    this.getServerData();
  },
  methods: {
	  getCategories(){},
	  getPopBlogs(){
		 this.column = {
			  catrgories:[],
			  series:[{
				  name:"阅读量",
				  data:[]
			  },{
				  name:"评论数",
				  data:[]
			  }]
		  }
		  let url =this.$params.host+this.$params.action_top_blogs
		  this.$req.get(url,res=>{
			  console.log(res);
			  res.data.data(b=>{
				  if(b.title.length>10){
					  b.title=b.title.substr(0,8) + "..."
				  }
				  this.column.catrgories.push(b.title)
				  this.column.series[0].data.push(b.readCount)
				  this.column.series[1].data.push(b.readCount)
			  })
		  })
	  }
		getTags(){
					  this.word ={
						  series:[]
					  }
					  let url =this.$params.host + this.$params.action_tags
					  this.$req.get(url,res=>{
						  console.log(res);
						  url =this.$params.host+ $params.action_tag_count + t.id
						  res.data.data.forEach(async (t)=>{
							  let r =await this.$req.request(url + t.id)
							  console.log(r);
							  if(r.success && r.data >0){
								  let tag = {
									  name :
								  }
							  }
						  })
					  })
		}
  }
};
</script>

<style scoped>
  /* 请根据实际需求修改父元素尺寸，组件自动识别宽高 */
  .charts-box {
    width: 100%;
    height: 300px;
  }
</style>